<template>
    <div style="background-color: cornflowerblue;">
        <h2>子组件</h2>
        <p>{{ name }}</p>
        <p>{{ age }}</p>
        <p>{{ gender }}</p>
    </div>
</template>

<script setup>
// const props = defineProps(['name', 'age', 'gender']);
// console.log(props);
// console.log(props.name);
// console.log(props.age);
// console.log(props.gender);

// const { name, age, gender = "女" } = defineProps(['name', 'age', 'gender']);

const { name, age, gender = "女" } = defineProps({
    name: {
        type: String,
        required: true
    },
    age: [Number, String],
    gender: String
})

console.log(name);
console.log(age);
console.log(gender);


</script>

<style scoped></style>